<template>
    <el-container>
        <el-header>
            <div class="left-panel">
  
            </div>
            <div class="right-panel">
                <el-button :icon="Search"   type="primary" @click="opBindData">查询</el-button>
                <el-button :icon="Search" type="info" plain @click="resetSearch">重置</el-button>
                <el-button text type="primary" @click="showCondition = !showCondition">
                    <span v-if="!showCondition">展开</span>
                    <span v-else>收起</span>
                    <vab-icon
                        class="vab-dropdown"
                        :class="{ 'vab-dropdown-active': fold }"
                        icon="arrow-up-s-line"
                    />
                </el-button>
            </div>
        </el-header>
        <el-foot v-show="showCondition">
            <vab-query-form-top-panel>
                <el-form inline label-width="49px" :model="queryForm" style="margin-top: 5px;margin-right: 20px;">
                    <el-row type="flex" style="flex-wrap:wrap">
                        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
                            <el-form-item label="业务日期" label-width="100px" style="width: 100%">
                                <el-date-picker
                                    style="width: 100%"
                                    v-model="queryList.giveDates"
                                    type="datetimerange"
                                    value-format="YYYY-MM-DD HH:mm:ss"
                                    format="YYYY-MM-DD HH:mm:ss"
                                    range-separator="-"
                                    unlink-panels="true"
                                    start-placeholder="开始时间"
                                    end-placeholder="结束时间"
                                    :default-time="defaultTime"
                                />
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </vab-query-form-top-panel>
        </el-foot>

        <el-main class="nopadding">
            <scTable
                ref="mytable"
                :queryType="'receiving-order/give-account-diffe-pages'"
                :data="listData"
                :queryList="queryList"
                :column="columnList"
                :orderList="OrderList"
                :sort-orders="['ascending', 'descending']"
                @selection-change="selectionChange"
                row-key="receivingOrderId"
                key="receivingOrderId"
                stripe
                show-summary
            >
                <el-table-column type="selection" width="50"></el-table-column>
                <template #giveDate="{row}">{{row.giveDate?.slice(0,10)}}</template>
            </scTable>
        </el-main>
    </el-container>


</template>

<script>
import publicjs from "@/api/model/publicjs";
import tool from "@/utils/tool";
import config from "@/config";
export default {
    name: "giveAccountDiffe",
    components: {
        publicjs,
    },
    data() {
        return {
            dialogSave: false,
            dialogSupplier: false,
            dialogBankInfo:false,
            dialogInvoiceInfo:false,
            showCondition: false,
            selectionRows: [],
            pkList: ["receivingOrderId"],
            columnList: [
                {
                    label: "业务时间",
                    prop: "giveDate",
                    width: "120",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "物料名称",
                    prop: "materialName",
                    width: "180",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "物料规格",
                    prop: "materialSpecs",
                    width: "120",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "单位",
                    prop: "unitName",
                    width: "100",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "入库数量",
                    prop: "storageOrderQty",
                    width: "115",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "出库数量",
                    prop: "receivingOrderQty",
                    width: "115",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "差异数量",
                    prop: "diffeQty",
                    width: "115",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "入库单号",
                    prop: "storageOrderCode",
                    width: "190",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "采购单号",
                    prop: "purchaseOrderCode",
                    width: "150",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "供应商",
                    prop: "supplierName",
                    width: "120",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "销售单号",
                    prop: "receivingOrderCode",
                    width: "190",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "赠送单号",
                    prop: "giveOrderCode",
                    width: "150",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
                {
                    label: "门店",
                    prop: "storeName",
                    width: "150",
                    sortable: true,
                    hide: false,
                    fixed: false,
                },
            ],
            OrderList: { giveDate: "Asc" },
            queryList: {},
            result: "", // 运行结果
            props1: {
                checkStrictly: true,
                emitPath: false,
            },
            orgCodeList: "",
            orgNameList: "",
            addState: true, //可以增加
            editState: true, //可以修改
            editBatchState: true, //可以批量修改
            deleteState: true, //可以删除
            optionsState: [],
            orgType: 1,
            defaultTime: [
                new Date(2000, 1, 1, 0, 0, 0),
                new Date(2000, 2, 1, 23, 59, 59),
            ],
        };
    },
    methods: {
        //表格选择后回调事件
        selectionChange(selection) {
            this.selectionRows = selection;
        },
        //本地更新数据
        handleSaveSuccess(data, mode) {
            if (mode == "Add") {
                this.$refs.mytable.refresh();
            } else if (mode == "Edit") {
                this.$refs.mytable.refresh();
            }
        },
        async opBindData() {
            this.$refs.mytable.clearSort();
            this.$refs.mytable.getData();
        },
        resetSearch() {
            this.queryList = {};
        },
        async initOptions() {

        },
    },
    async mounted() {
        this.orgType = tool.data.get("USER_INFO").AccountType;
        // 获取当前日期
        const now = new Date();
        let currentDate = new Date();
        // 获取当前月份
        let currentMonth = currentDate.getMonth();
        // 设置为前一个月
        currentDate.setMonth(currentMonth - 1);
        // 将时间设置为 12:00 PM
        currentDate.setHours(0, 0, 0, 0); 
        this.queryList.giveDates = [tool.formatDate(currentDate), tool.formatDate(now)];
        await this.initOptions();
        await this.opBindData();
    },
};
</script>
